<template>
  <div class="mr-sr-topData"> 
    <div class="mr-sr-firstbg">
      <el-table
        ref="receiveTable"
        size="mini"
        :data="resData"
        style="width: 100%"
        @selection-change="handleSelectionChange"
        highlight-current-row
        height="350"
      >
      <el-table-column type="selection" width="40"> </el-table-column> 
      <el-table-column prop="ROW_ID" label="序号" width="50" :show-overflow-tooltip="true"> </el-table-column>
      <!-- <el-table-column prop="wmsDeliveryPlanId" label="交接单id" width="130" :show-overflow-tooltip="true"> </el-table-column> -->
      <el-table-column prop="status" label="状态" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="isEff" label="是否有效" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="requireShop" label="需求单位" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="barcode" label="条码" width="150" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="mesCheckQualiticationId" label="合格证信息" width="130" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="itemCode" label="图号" width="130" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="qualityCode" label="质编/件号" width="130" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="mProductNumber" label="型号" width="130" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="problemType" label="问题类型" width="130" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="problemContent" label="问题内容" width="130" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="applyName" label="发起人" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="applyDate" label="发起时间" width="140" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="endApplyName" label="归零发起人" width="130" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="endApplyDate" label="归零发起时间" width="140" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="empName" label="归零人" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="endDate" label="归零时间" width="140" :show-overflow-tooltip="true"> </el-table-column>
     
      </el-table>
    </div>
    <!-- 完整功能分页 -->
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="pageNumber"
      :page-sizes="[5,10,20,50,100]"
      :page-size="pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="totalCount">
    </el-pagination>
  </div>
</template>
<script>

import { mrCmTableSearch } from '@/utils/api.js'

export default {
  name: "MrShTopData",
  data() {
    return {
      coordinateData:{},
      // 当前页数
      pageNumber: 1,
      // 数据总个数
      totalCount: 0,
      // 返回的数据数组
      resData: [],
      // 每页数据个数
      pageSize: 20,
      multipleSelection:[],
      searchData: {
        startTime: "",
        endTime: "",
        tuhao: "",
        qualityNumber: "",
        person: "",
        status:"",
        isEff:""
      },
    };
  },
  methods: {
    // 选择每页条数后请求接口更新表格
      handleSizeChange(val) {
        this.pageSize = val
        console.log("选择每页条数",val)
        mrCmTableSearch({


        pageParameter:{
          rows:this.pageSize,
          page:this.pageNumber
        },
        searchParams:{
          barcode:this.searchData.barcode,
		      applyEmpcode:this.searchData.person,
          status:this.searchData.status,
          isEff:this.searchData.isEff
        },
        startTime:this.searchData.startTime,
        endTime:this.searchData.endTime,
      }).then((res)=>{
        this.resData = res.data.responseBody.result
        console.log("扫码退回分页1",res)
      })
        // 传pageSize给midSearch
        //this.$bus.$emit('srPageNumbers',this.pageSize)
        // console.log(`每页 ${val} 条`);
      },
    // 分页函数
    handleCurrentChange(val) {
      this.pageNumber = val;
      console.log("选择多少页",val)
      mrCmTableSearch({
        pageParameter:{
          rows:this.pageSize,
          page:this.pageNumber
        },
        searchParams:{
          barcode:this.searchData.barcode,
		      applyEmpcode:this.searchData.person,
          status:this.searchData.status,
          isEff:this.searchData.isEff
        },
        startTime:this.searchData.startTime,
        endTime:this.searchData.endTime,
      }).then((res)=>{
        this.resData = res.data.responseBody.result
        console.log("扫码退回分页2",res)
      })
    },
    // 复选选函数
    handleSelectionChange(val){
      this.multipleSelection = val
      this.$bus.$emit('mrCoMmaterialId',this.multipleSelection)
      console.log('勾选',val)
    },
  },
  mounted() {
    // 传参给Search 调用查询接口
    this.$bus.$emit('mrCmStartData','search')
    // 接收查询按钮返回的Data和查询条件
    this.$bus.$on('mrCmTablesData',(e)=>{
      console.log("查询传入表格参数11",e)
      this.resData = e.data.responseBody.result;
      this.totalCount = e.data.responseBody.pageParameter.totalCount;
      this.pageSize = e.data.responseBody.pageParameter.rows;
      this.pageNumber = e.data.responseBody.pageParameter.page;
    })  
    this.$bus.$on('coordinateData',(coordinateData)=>{
      console.log("xd传入表格参数coordinateData1",coordinateData)
      this.searchData = coordinateData;
      
    })
  },
  watch:{
    
  }
};
</script>


<style scoped>
.mr-sr-topData {
  width: 100%;
  height: 100%;
}
.mr-sr-firstbg {
  text-align: center;
}
.el-pagination {
  text-align: center;
}

</style>